<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
</head>
<body>
    <!-- 导航栏片段 -->
    <nav th:fragment="navbar(title, icon)" class="navbar navbar-expand-lg navbar-dark">
        <div class="container">
            <a class="navbar-brand" href="/">
                <i th:class="${icon + ' me-2'}"></i>[[${title}]]
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav ms-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="/friends">
                            <i class="fas fa-users"></i> 好友
                            <span class="badge bg-danger" id="friendRequestCount"></span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/ranking">
                            <i class="fas fa-trophy"></i> 排行榜
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/shop">
                            <i class="fas fa-store"></i> 商城
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/settings">
                            <i class="fas fa-cog"></i> 设置
                        </a>
                    </li>
                    <li class="nav-item">
                        <span class="nav-link">
                            <i class="fas fa-user"></i> 
                            <span id="playerName"></span>
                        </span>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="/">
                            <i class="fas fa-home"></i> 返回大厅
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#" id="logoutBtn">
                            <i class="fas fa-sign-out-alt"></i> 退出
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- 导航栏样式片段 -->
    <th:block th:fragment="navbar-style">
        <style>
            .navbar {
                padding: 0.5rem 1rem;
                background: linear-gradient(135deg, #1e88e5, #1565c0);
            }
            
            .navbar-brand {
                font-size: 1.2rem;
                font-weight: 600;
            }
        </style>
    </th:block>
</body>
</html> 